<template>
  <div>
    <Comment />
    <Pagination />
  </div>
</template>

<script>
import Comment from './Comment'
import Pagination from './Pagination'
import {
  SET_COMMENT_QUERY_COMMENT_TYPE,
  SET_COMMENT_QUERY_RELEVANT_ID,
  SET_COMMENT_QUERY_PAGE_PAGE,
  SET_PARENT_COMMENT_ID
} from '@/store/mutations-types'

export default {
  name: 'CommentList',
  components: { Comment, Pagination },
  props: {
    commentType: {
      type: Number,
      required: true
    },
    relevantId: {
      type: Number,
      required: false
    }
  },
  created() {
    this.init()
  },
  watch: {
    //在博客文章路由到其它含有评论的页面时，要重新获取评论
    '$route.path'() {
      this.init()
    }
  },
  methods: {
    init() {
      //重置评论表单位置
      this.$store.commit(SET_PARENT_COMMENT_ID, -1)
      this.$store.commit(SET_COMMENT_QUERY_COMMENT_TYPE, this.commentType)
      this.$store.commit(SET_COMMENT_QUERY_RELEVANT_ID, this.relevantId)
      this.$store.commit(SET_COMMENT_QUERY_PAGE_PAGE, 1)
      this.$store.dispatch('getCommentList')
    }
  }
}
</script>

<style scoped></style>
